<template>
	<view>
		<uni-forms ref="form" :modelValue="formData" :rules="rules">

			<view class="s4">职务:</view>
			<uni-forms-item name="zhiwu" style="width: 50%;margin-left: 90px;">
				<uni-easyinput class="s3" type="text" v-model="formData.zhiwu" placeholder="请输入职务" />
			</uni-forms-item>
			<view class="s4">简介:</view>
			<uni-forms-item name="jieshao" style="width: 50%;margin-left: 90px;">
				<uni-easyinput class="s3" type="textarea" v-model="formData.jieshao" placeholder="请输入简介" />
			</uni-forms-item>
			<view class="s4">毕业于:</view>
			<uni-forms-item name="biye" style="width: 50%;margin-left: 90px;">
				<uni-easyinput class="s3" type="textarea" v-model="formData.biye" placeholder="请输入毕业学校" />
			</uni-forms-item>
			<view class="s4">专业:</view>
			<uni-forms-item name="zhuanye" style="width: 50%;margin-left: 90px;">
				<uni-easyinput class="s3" type="text" v-model="formData.zhuanye" placeholder="请输入所学专业" />
			</uni-forms-item>
			<view class="s4">主修:</view>
			<uni-forms-item name="zhuxiu" style="width: 50%;margin-left: 90px;">
				<uni-easyinput class="s3" type="textarea" v-model="formData.zhuxiu" placeholder="请输入主修课程" />
			</uni-forms-item>
			<view class="s4">头像:</view>
			<image style="width: 150px;margin-left: 25px;" mode="widthFix" :src="formData.zhaop"></image>
			<view class="s5">头像:</view>
			<uni-forms-item name="zhaop" style="width: 50%;margin-left: 90px;">
				<uni-file-picker style="margin-top: -20px;" v-model="imageValue" fileMediatype="image" mode="grid"
					limit=1 />
			</uni-forms-item>
			<view class="s6" @click="submit">查询</view>
			<view class="s6" @click="gengxin">更改内容</view>
			<view class="s6" @click="toxiang">更改头像</view>
			<view class="s6" @click="xinzeng">新增师资</view>
			<view class="s6" @click="shanchu">删除师资</view>
			<view style="width: 100%;height: 50px;"></view>
		</uni-forms>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				formData: {
					biye: "",
					jieshao: "",
					zhiwu: "",
					zhuanye: "",
					zhuxiu: "",
					zhaop: ""
				},
				imageValue: [],
				rules: {
					// 对name字段进行必填验
					zhiwu: {
						rules: [{
							required: true,
							errorMessage: '请输入职务',
						}]
					}
				}

			}

		},
		methods: {
			submit() {
				this.$refs.form.submit().then(res => {
					var that = this
					var par = {
						zhiwu: that.formData.zhiwu
					}
					const db = uniCloud.database();
					db.collection("tblshizi")
						.where(par)
						.get()
						.then(function(d) {
							
							if(d.result.data!=""){
								uni.setStorageSync("shizi", d.result.data)
								that.formData = d.result.data[0]
							}else{
								uni.showToast({
									title:"没有这个职务"
								})
							}
						})
				}).catch(err => {
					console.log('表单错误信息：', err);
				})
			},
			gengxin() {
				var that = this

				var aa = {
					biye: that.formData.biye,
					jieshao: that.formData.jieshao,
					zhiwu: that.formData.zhiwu,
					zhuanye: that.formData.zhuanye,
					zhuxiu: that.formData.zhuxiu,
					
				}
				const db = uniCloud.database();
				db.collection("tblshizi")
					.where(uni.getStorageSync("shizi")[0])
					.update(aa)
					.then(function(d) {
						if (d.result.data!="") {
							uni.showToast({
								title: "更改成功"
							})
						} else {
							uni.showToast({
								title: "您还没有填写哦"
							})
						}

					})
			},
			xinzeng() {
				var that = this
				var par = {
					biye: that.formData.biye,
					jieshao: that.formData.jieshao,
					zhiwu: that.formData.zhiwu,
					zhuanye: that.formData.zhuanye,
					zhuxiu: that.formData.zhuxiu,
					zhaop: that.imageValue[0].path,
				}
				const db = uniCloud.database();
				db.collection("tblshizi")
					.add(par)
					.then(function(d) {
						if (d.result.data!="") {
							uni.showToast({
								title: "新增成功"
							})
						} else {
							uni.showToast({
								title: "您还没有填写哦"
							})
						}
					})
			},
			shanchu() {
				var that = this
				var par = {


					zhiwu: that.formData.zhiwu,

				}
				const db = uniCloud.database();
				db.collection("tblshizi")
					.where(par)
					.remove()
					.then(function(d) {
						uni.showToast({
							title: "删除成功"
						})
					})
			}
			,toxiang(){
				var that=this
				var par={
					zhaop: that.imageValue[0].path,
				}
				const db = uniCloud.database();
				db.collection("tblshizi")
				.where(uni.getStorageSync("shizi")[0])
				.update(par)
				.then(function(d){
					uni.showToast({
						title:"头像更新成功"
					})
				})
			}
		}
	}
</script>

<style>
	.s4 {
		font-size: 15px;
		font-weight: 600;
		float: left;
		margin-top: 30px;
		padding-left: 30px;
	}

	.s3 {
		width: 250px;
		margin-top: 25px;
		float: left;
		margin-left: -5px;
		border: 1px solid #FF9900;
		border-radius: 10px;
	}

	.s6 {
		width: 330px;
		border: 1px solid #FCBD71;
		font-size: 18px;
		margin-left: 20px;
		margin-top: 20px;
		text-align: center;
		line-height: 40px;
		border-radius: 40px;
		color: #FCBD71;
		height: 40px;
		font-weight: 400;
	}

	.s5 {
		font-size: 15px;
		font-weight: 700;
		margin-left: 30px;
		margin-top: 15px;
	}
</style>
